<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>注册页面</title>
    <script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
    <script type="text/javascript">
        var time = 60;

        //开始定时
        function showTime() {
            var but = $("input[type='button']");
            but.attr("disabled", true);
            but.val("" + time-- + "秒后重新发送");

        }

        //停止计时
        function stop() {
            clearInterval(times);
            var but = $("input[type='button']");
            but.val("获取验证码");
            but.attr("disabled", false);
        }

        var getCode = function () {
            time = 60;
            $.post("doCode", null, function (data) {
                if (data) {
                    times = setInterval("showTime();", 1000);
                    setTimeout("stop();", 60 * 1000);
                }
            }, "json")
        }

    </script>
</head>
<body>
<p>验证码过期测试</p>
<form action="/login" method="post">
    <input type="text" placeholder="请输入用户名" name="username"/><br><br>
    <input type="text" placeholder="请输入密码" name="password"/><br><br>
    <input type="text" placeholder="验证码" name="code"/>
    <input type="button" value="获取验证码" "getCode()"/><br><br>
    <input type="submit" value="提交"/>
</form>
</body>
</html>

